<ion-header>
  <ion-navbar color="dark">
    <!-- <a color="dark">地区选择</a> -->
    <ion-title class="center" style="float: left;margin-left: 43%">
      <img class="logo" src="assets/images/logo.png" alt="">
    </ion-title>
    <ion-icon name="md-add" style="color: white;float: right;margin-right:5px;margin-top: 15px"
              (click)="openPubSportDynamic()"></ion-icon>
  </ion-navbar>
</ion-header>


<ion-content>

  <ion-refresher (ionRefresh)="doRefresh($event)">
    <ion-refresher-content
      pullingIcon="arrow-dropdown"
      pullingText="下拉刷新"
      refreshingSpinner="circles"
      refreshingText="正在刷新...">
    </ion-refresher-content>
  </ion-refresher>

  <ion-slides *ngIf="banners!=null" style="width:100%;height:200px" pager="true" [loop]="true" autoplay=1000 speed="500"
              autoplayDisableOnInteraction="false">
    <ion-slide *ngFor="let banner of banners">
      <img src="{{bannerPath}}/{{banner.bannerImg}}">
    </ion-slide>
  </ion-slides>
  <ion-item style="padding: 0;border: none;">
    <label class="topic">运动话题</label>
    <a class="more right">更多<i></i></a>
  </ion-item>
  <div class="topic-left">
    <img src="assets/images/bg-topic-left.jpg" alt="">
    <div class="tit">
      <p>运动小常识<br/>/<br/>1003人参与</p>
    </div>
  </div>
  <div class="topic-right">
    <img src="assets/images/bg-topic-right.jpg" alt="">
    <div class="tit">
      <p>运动健康美食<br/>/<br/>500人参与</p>
    </div>
  </div>
  <ion-item style="padding: 0;border: none;">
    <label class="topic">精选动态</label>
  </ion-item>
  <ion-card *ngFor="let sportDynamic of sportDynamicList">
    <ion-item>
      <ion-avatar item-start>
        <img src="{{userFacePath}}/{{sportDynamic.userFace}}">
      </ion-avatar>
      <h2>{{sportDynamic.nickname}} <ion-icon *ngIf="sportDynamic.sex==1" ios="ios-female" md="md-female" class="female"></ion-icon>
        <ion-icon *ngIf="sportDynamic.sex==0" ios="ios-male" md="md-male" class="male"></ion-icon></h2>

      <p>{{sportDynamic.crteateDatetime}}</p>
    </ion-item>
    <img (click)="openDetail()" src="{{sportDynamicImgPath}}/{{sportDynamic.sportDynamicImg}}">
    <ion-card-content (click)="openDetail()">
      <p>{{sportDynamic.sportDynamicContent}}</p>
    </ion-card-content>
    <ion-row>
      <ion-col>
        <button ion-button icon-left clear small (click)="doLike(sportDynamic.id)">
          <ion-icon name="thumbs-up"></ion-icon>
          <div>{{sportDynamic.sportDynamicLikesNum}} 喜欢</div>
        </button>
      </ion-col>
      <ion-col>
        <button ion-button icon-left clear small>
          <ion-icon name="text"></ion-icon>
          <div> 评论</div>
        </button>
      </ion-col>
      <ion-col center text-center>
        <ion-note class="passTime" *ngIf="sportDynamic.pastMinutes==0">刚刚</ion-note>
        <ion-note class="passTime" *ngIf="sportDynamic.pastMinutes<60">{{sportDynamic.pastMinutes}}分钟 之前</ion-note>
        <ion-note class="passTime" *ngIf="sportDynamic.pastMinutes<12">{{sportDynamic.pastHour}}小时 之前</ion-note>
        <ion-note class="passTime" *ngIf="sportDynamic.pastHour>=12">{{sportDynamic.crteateDatetime}}</ion-note>
      </ion-col>
    </ion-row>
  </ion-card>


  <!--<button (click)="jpushInit()" ion-button block>Init</button>-->
  <!--<button (click)="jpushStop()" ion-button block>Stop</button>-->
  <!--<button (click)="jpushGetRegistrationID()" ion-button block>Get RegistrationID</button>-->
  <!--<button (click)="jpushResumePush()" ion-button block>Resume</button>-->
  <!--<button (click)="jpushSetAlias()" ion-button block>SetAlias</button>-->


  <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
    <ion-infinite-scroll-content
      loadingSpinner="bubbles"
      loadingText="加载更多数据...">
    </ion-infinite-scroll-content>
  </ion-infinite-scroll>
</ion-content>
